<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:pm="http://primefaces.org/mobile"
	xmlns:mobi="http://www.icesoft.com/icefaces/mobile/component">

<f:view renderKitId="PRIMEFACES_MOBILE" />


<h:head>
	<script type="text/javascript"
		src="http://maps.google.com/maps/api/js?sensor=true" />
</h:head>
<h:body>
	<pm:page id="buscarEventos">

		<pm:header title="MapEvent2.0" />
		<pm:content>
			<h:form>
				<p:gmap id="gmap" center="3.436658158559092,-76.52252197265625"
					zoom="13" type="HYBRID" style="width:100%;height:50em"
					model="#{eventosView.emptyModel}"
					onPointClick="handlePointClick(event);" widgetVar="map">
					<p:ajax event="overlaySelect"
						listener="#{eventosView.onMarkerSelect}" />
					<p:gmapInfoWindow rendered="true">
						<p:outputPanel
							style="text-align:center;display:block;margin:auto;height:360px"
							rendered="true">
								<p:graphicImage value="/#{eventosView.foto.id}.jpg" cache="false"
								 width="270" height="200">
								</p:graphicImage>
							<p:panelGrid columns="2" style="margin: 0 auto;" rendered="true">
								<h:outputLabel value="Nombre evento:" />
								<h:outputText value="#{eventosView.nombre}" />

								<h:outputLabel value="Fecha:" />
								<h:outputText value="#{eventosView.fecha2}" />

								<h:outputLabel value="Hora:" />
								<h:outputText value="#{eventosView.hora2}" />

								<h:outputLabel value="Dirección" />
								<h:outputText value="#{eventosView.direccion}" />

								<h:outputLabel value="Tipo Evento" />
								<h:outputText value="#{eventosView.tipoEvento}" />
							</p:panelGrid>

						</p:outputPanel>
					</p:gmapInfoWindow>
				</p:gmap>
			</h:form>
		</pm:content>
	</pm:page>
</h:body>
</html>